<template>
	<view class="license-info" :style="{background:pageColor}" v-if="detail.id">
		<view class="space-md"></view>
		<view class="basic-info ml-md mr-md flex radius-16 fill-base">
			<view class="flex-center" style="height: 48rpx;">
				<i class="iconfont icontongguorenzheng" :style="{color: primaryColor}"></i>
			</view>
			<view class="flex-1 pl-md">
				<view class="f-title text-bold">{{$t('action.attendantName')}}实名认证通过</view>
				<view class="pt-md f-paragraph">身份证: {{detail.id_code}}</view>
				<view class="f-desc pt-sm" style="color: #F96246;">所有{{$t('action.attendantName')}}签约入驻平台时，身份信息均已通过核验
				</view>
			</view>
		</view>
		<view class="ml-md mr-md pl-lg pr-lg pb-lg fill-base radius-16 mt-md" v-if="configInfo.coach_license_show">
			<view class="license-info-title f-title text-bold flex-y-center">资格证书</view>
			<view class="fill-body pd-md radius-16 mb-md" v-for="(item,index) in detail.license" :key="index">
				<image @tap.stop="toPreviewImage(index)" mode="widthFix" class="item-img" :src="item">
				</image>
			</view>
			<view class="fill-body pd-md radius-16 mb-md" v-if="detail.license.length===0">
				暂未上传证书
			</view>
		</view>

		<view class="space-footer"></view>
		<!-- #ifdef APP-PLUS -->
		<longbingbing-preview-image ref="preview_image_item"></longbingbing-preview-image>
		<!-- #endif -->
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from "vuex"
	export default {
		components: {},
		data() {
			return {
				options: {},
				detail: {},
			}
		},
		computed: mapState({
			configInfo: state => state.config.configInfo,
		}),
		onLoad(options) {
			this.options = options
			this.initIndex()
		},
		methods: {
			...mapMutations(['updateUserItem']),
			async initIndex() {

				let {
					id,
					license,
					id_code,
					industry_data
				} = this.$util.getPage(-1).detail
				this.detail = {
					id,
					license,
					id_code,
					industry_data
				}
				this.$util.setNavigationBarColor({
					bg: this.primaryColor
				})
				// #ifdef H5
				this.$jweixin.hideOptionMenu()
				// #endif
			},
			initRefresh() {
				this.initIndex()
			},
			toPreviewImage(index) {
				let urls = this.detail.license
				// #ifdef APP-PLUS 
				if (plus.os.name == 'Android' && plus.navigator.checkPermission(
						'android.permission.WRITE_EXTERNAL_STORAGE') === 'undetermined') {
					this.$refs.preview_image_item
						.previewImage({
							current: urls[index],
							urls
						})
				} else {
					this.$util.previewImage({
						current: urls[index],
						urls
					})
				}
				// #endif
				// #ifndef APP-PLUS
				this.$util.previewImage({
					current: urls[index],
					urls
				})
				// #endif 
			},
		}
	}
</script>


<style lang="scss">
	.license-info {

		.basic-info {
			padding: 40rpx 30rpx 24rpx 30rpx;
		}

		.item-img {
			width: 610rpx;
		}

		.license-info-title {
			height: 110rpx;
		}
	}
</style>